<!--  -->
<template>
<div class='content'>
  <c-title :hide="false"
    :text="shop_name+'二维码'"
  ></c-title>
  <div class="microshop flex-j-c flex-a-c">
    <view class="microshop-box"></view>
    <div class="qr-code "  @touchstart="touchStart()" @touchend="touchEnd()">
      <img :src="qrCode"  />
    </div>
    <p>扫描{{shop_name}}二维码，跳转至{{shop_name}}页面</p>
  </div>
</div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
import cTitle from "components/title";
export default {
components: { cTitle },
name:'',
//import引入的组件需要注入到对象中才能使用
components: {},
data() {
return {
  shopId:'',
  qrCode:'',
  shop_name:"",
  Loop:'',//定时器
};
},
//监听属性 类似于data概念
computed: {},
//监控data中的数据变化
watch: {},
//方法集合
methods: {
  initData(){
    $http
        .get("plugin.micro.frontend.controllers.MicroShop.index", {}, "加载中")
        .then( (response) =>{
            if (response.result == 1) {
              let data = response.data;
              
              let shop_name = data.lang||'微店';
              this.shop_name = shop_name;
              this.fun.setWXTitle(shop_name+'二维码')
   
            } else {
              console.log(response);
            }
          },
          function(response) {
            console.log(response);
          }
        );
  },
  touchEnd(){
      //手指离开
      clearTimeout(this.Loop);
  },
  touchStart(){
      //手指触摸
      clearTimeout(this.Loop); //再次清空定时器，防止重复注册定时器
      this.Loop = setTimeout(() => {
          // console.log(1222)
          this.downImg()
      },1000)
  },
    // 下载
  downImg() {
      if(!window.plus) return;
          plus.gallery.save(this.imgUrl, function () {
              console.log('保存成功');
          },function(){
              console.log('保存失败');
      });
  },
  posterImg() {
      $http
        .get("plugin.micro.frontend.controllers.MicroShop.index.poster",{shop_id:this.shopId,basic_info:1}, "加载中")
        .then(
          (response) => {
            if (response.result == 1) {
              let basicInfo = response.basic_info;
              let res = response.data;
              this.qrCode = res.qr_code;
              this.$nextTick(() => {
              this.fun.wxShare(
                "",
                { mid: this.fun.getKeyByMid() },
                {
                  link: window.location.href,
                  title: basicInfo?.home.mailInfo?.name,
                  imgUrl: basicInfo?.home.mailInfo?.logo_url,
                  description: ''
                }
              );
          },50);
            } else {
              console.log(response);
            }
          },
          function(response) {
            console.log(response);
          }
        );
    }

},
//生命周期 - 创建完成（可以访问当前this实例）
created() {
  this.shopId = this.$route.params.shop_id;
  if(this.shopId) {
    this.posterImg();
  }
  this.initData();
  
},
//生命周期 - 挂载完成（可以访问DOM元素）
mounted() {

},
beforeCreate() {}, //生命周期 - 创建之前
beforeMount() {}, //生命周期 - 挂载之前
beforeUpdate() {}, //生命周期 - 更新之前
updated() {}, //生命周期 - 更新之后
beforeDestroy() {}, //生命周期 - 销毁之前
destroyed() {}, //生命周期 - 销毁完成
activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
}
</script>
<style lang="scss" scoped>
/* @import url(); 引入公共css类 */
.microshop {
  margin: 1.25rem auto;
  flex-direction: column;

  p {
    padding: 1.25rem 0 0 0;
    font-size: 1rem;
  }
}

.microshop-box {
  height: 1.25rem;
  clear: both;
}

.qr-code {
  display: inline-block;
  background-color: #fff;

  img {
    width: 100%;
    height: auto;
    display: block;
  }
}

</style>